<template>
    <div :id="id"></div>
</template>

<script>
    import './../api/trumbowyg/trumbowyg.js'
    import './../api/trumbowyg/fr.js'
    import './../api/trumbowyg/trumbowyg.base64.js'

    export default {
        props: ['id'],
        data () {
            return {
            }
        },
        mounted() {
            $.extend(true, $.trumbowyg.langs, {
                fr: {
                    align: 'Alignement',
                    image: 'Image'
                }
            })
            $('#'+this.id).trumbowyg({
                lang: 'fr',
                fixedBtnPane: true,
                btnsDef: {
                    image: {
                        dropdown: ['insertImage', 'base64'],
                        ico: 'insertImage'
                    }
                },
                btns: [
                    ['formatting'],
                    ['strong', 'em', 'del'],
                    ['superscript', 'subscript'],
                    ['link'],
                    ['image'],
                    ['justifyLeft', 'justifyCenter', 'justifyRight', 'justifyFull'],
                    ['unorderedList', 'orderedList'],
                    ['horizontalRule'],
                    ['removeformat'],
                    ['fullscreen']
                ]
            })
        }
    }
</script>

